JavaScript ES6新语法入门 您所在的位置:网站首页 js es6语法 JavaScript ES6新语法入门

JavaScript ES6新语法入门

#JavaScript ES6新语法入门| 来源: 网络整理| 查看: 265

腾讯云实验平台开春福利,100+门实验限免体验,精品实验享8折优惠! >>> 1.let&const

let:声明的变量是局部变量

const:声明的变量是常量,不能被修改

var a = 10; function run1(){     var a = 20;     console.info(a); } run1(); console.info(a); //结果为 : //20 //20 var a1 = 10; function run2(){     console.info(a1); } run2(); console.info(a1); //结果为 : //20 //20

使用let

let a = 10; function run2(){     let a = 20;     console.info(a); } run2(); console.info(a); //结果为 : //10 //20 let a1 = 10; function run3(){     console.info(a1); } run3(); console.info(a1); //结果为 : 报错,a未定义 //因为a是在run3函数外定义的,run3拿不到a的值 2.字符串扩展

ES6为字符串扩展了几个新API:

1)includes():返回布尔值,表示是否找到了这个字符串。

2)startsWith():返回布尔值,表示参数字符串是否在原字符串的头部。

3)endsWith():返回布尔值,表示参数字符串是否在原字符串的尾部。

 

4)模板字符串

let a = "你好"; let b = "大家好"; let str = `holle ${a}            World ${b}` //可以直接换行空格 //可以直接使用${变量名},插入变量 // 注: ` 符号在键盘上的esc的下面,1的左面,tab的上面

5)解构

//1.数组: let arr = [1,2,3]; let [a,b,c] = arr; console.info(`${a},${b},${c}`); // 结果为1,2,3 // 会直接将数组里面的值拿出来,[a,b,c]相当于定义了三个变量 //2.对象: //2.1 let obj = {name:'jack',age:18}; let {name,age} = obj; console.info(name+","+age); // 直接将对象中的字段拿出来了, 前提是必须对应对象中的字段 //2.2 let {name:username,age:userage} = obj; console.info(username+","+userage); // 拿出数据可以给变量起别名 //2.3 let obj1 = {name:'jack',age:18}; let {name:username1 = 'rose',age:userage1 = 123,sex = '男'} = obj1; console.info(`${username1},${userage1},${sex}`); // 拿不到数据,可以定义默认数据 //2.4 let obj2 = {name:'jack',age:18,sex:'男'}; let {name:username2,...property} = obj2; console.info(`${username2}`); console.info(property);//解构出来一个对象 //就不解释了.... //js强大啊。。java什么时候也出个,哈哈 3.箭头函数 //定义函数的简写方式: //一个参数时: var print = function (obj){ console.info(obj); } //简写为: var paint = obj => console.info(obj); //多个参数: //两个参数的情况: var sum = function(a,b){ return a+b; } //简写: var sum2 = (a,b) =>{ return a+b; } console.info(sum2(1,2)); // 返回值为一行代码的情况下: 必须省略return var sum3 = (a,b) => a+b; console.info(sum3(1,2)); //是不是特别简单,告诉你,java中也有类似箭头函数的语法,交lambda表达式, //在我前几天的博客中有写,感兴趣可以去看,地址放在下面。

lambda表达式博客连接

举例箭头函数结合解构

 

let student = { name: "jack", age: 18 }; let run = ({name,age}) =>{ console.info(name,age) } run(student); //一个对象参数,一解构的方式传入方法,使代码更加简化。。 4.map&reduce //map: //接收一个函数,将原数组中的所有元素用这个函数处理后放入新数组返回 //举例: 有个字符串数组,转为int数组 let arr = ['1','10','-1','5']; console.info(arr); arr = arr.map(a => parseInt(a)); console.info(arr); //结果: [1,10,-1,5] //reduce: // 接收一个函数(必须)和一个初始化值(可选),该函数接收两个参数: // 参数一: 是上次reduce处理的结果 // 参数二: 是数组中要处理的下一个元素 // reduce() 会从左到右依次把数组中的元素用reduce处理, 并把处理的结果作为下次 // reduce的结果作为下次reduce的第一个参数。如果是第一次,会把前两个元素作为计算参 // 数,或者把欧诺用户指定的初始化值作为起始参数。 //举例: const arr = [1,10,-1,5]; console.info(arr.reduce((a,b) => a+b)); //结果:19 console.info(arr.reduce((a,b) => a*b)); //结果:-300 console.info(arr.reduce((a,b) => a*b,-1)); //结果:300

有帮助点个赞啊o(* ̄︶ ̄*)o



【本文地址】

公司简介

联系我们

今日新闻

    推荐新闻

    专题文章
      CopyRight 2018-2019 实验室设备网 版权所有